<template>
	<div>
		<el-row :span="24" style="margin:26px 0;">
		     <el-button  @click="$router.push('/user/creator_list')" type="primary" >返回</el-button>
		</el-row>
		<div  class="type_list" style="font-size: 18px;">
		      <span style="cursor: pointer;font-size: 18px; "  @click="$router.replace('/user/user_detail/'+$route.query.id)">用户资料</span>
		      <span style="cursor: pointer;font-size: 18px;"  @click="$router.replace('/user/treasure_record/'+$route.query.id)">财富记录</span>
		      <span style="cursor: pointer;font-size: 18px;"  @click="$router.replace('/user/transaction_detail/'+$route.query.id)">交易明细</span>
		      <span style="cursor: pointer;font-size: 18px;"  @click="$router.replace('/user/receive_record/'+$route.query.id)">领取红包记录</span>
		      <span style="cursor: pointer;font-size: 18px;"  @click="$router.replace('/user/send_detail/'+$route.query.id)">发送红包记录</span>
		      <span style="cursor: pointer;font-size: 18px;"  @click="$router.replace('/user/agency/'+$route.query.id)">代理记录</span>
			  <span style="cursor: pointer;font-size: 18px;font-weight: 500;"  class="choosed">创客信息</span>
		</div> 
		<div>
			<div style="font-size: 18px;margin-top: 15px;">财富信息</div>
			 <el-table
			        :data="moneyInfo"
			        border
			        stripe
			        style="width: 100%;margin-top:10px;">
			    <el-table-column
			            label="用户昵称">
			            <template scope="scope">
			                <span>{{ scope.row.userName}}</span>
			            </template>
			    </el-table-column>
			    <el-table-column
			            label="今日收益">
			            <template scope="scope">
			                <span>{{ scope.row.sumIncomeToday }}</span>
			            </template>
			    </el-table-column>
			    <el-table-column
			            label="可提现抵用券">
			            <template scope="scope">
			                <span>{{ scope.row.offSet}}</span>
			            </template>
			    </el-table-column>
			    <el-table-column
			            label="操作">
			            <template scope="scope">
	
							<el-button type="primary" size="small"
							           @click="navToEarningsList()">收益列表
							</el-button>
							<el-button type="primary" size="small"
							           @click="navToCashHistory()">提现记录
							</el-button>

			            </template>
			    </el-table-column>   
			</el-table>
		<div style="font-size: 18px;margin-top: 15px;">邀请统计</div>
		 <el-table
		        :data="CountUserList"
		        border
		        stripe
		        style="width: 100%;margin-top:10px;">
		    <el-table-column prop="countMarkerFirst"  label="一级创客">
		    </el-table-column>
		    <el-table-column
		            prop="countMarkerSecond" 
		            label="二级创客">
		     
		    </el-table-column>
		    <el-table-column
		            label="一级用户"
					prop="countFirst">

		    </el-table-column>
		    <el-table-column
		            label="二级用户"
					prop="countSecond">
		    </el-table-column>
		    <el-table-column
		            label="操作">
		            <template scope="scope">
						<el-button type="primary" size="small"
						           @click="navToInviteDetail()">查看详情
						</el-button>
		            </template>
		    </el-table-column>   
		</el-table>
				
		
		</div>
		
		<div style="font-size: 18px;margin-top: 15px;">创客认证信息</div>
		 <el-table
		        :data="CreatorInfor"
		        border
		        stripe
		        style="width: 100%;margin-top:10px;">
		    <el-table-column prop="name"  label="姓名">
		    </el-table-column>
		    <el-table-column
		            prop="phoneNum" 
		            label="联系人手机号">
		     
		    </el-table-column>
		    <el-table-column
		            label="个人所在地"
					prop="address">
		
		    </el-table-column>
		    <el-table-column
		            label="认证状态"
					>
					<template scope="scope">
					   <p v-if="scope.row.openingStatus == 'B' " style="color: red;">审核中</p>
					   <p v-if="scope.row.openingStatus == 'S' " style="color: red;">快捷通审核通过</p>
					   <p v-if="scope.row.openingStatus == 'F' " style="color: red;">快捷通审核失败</p>
					   <p v-if="scope.row.openingStatus == 'P' " style="color: red;">平台审核成功</p>
					   <p v-if="scope.row.openingStatus == 'L' " style="color: red;">平台审核失败</p>
					</template>
		    </el-table-column>
			<el-table-column
			        label="失败原因"
					v-if="CreatorInfor[0].openingStatus != 'S' && CreatorInfor[0].openingStatus != 'B' && CreatorInfor[0].openingStatus != 'P'"
					>
					<template scope="scope">
					   <p style="color: red;">
						   {{scope.row.failReason}}
					   </p>
					</template>
					
			</el-table-column>
		    <el-table-column
		            label="操作">
		            <template scope="scope">
						<el-button type="primary" size="small"
						           @click="navToVerifyDetail()">查看详情
						</el-button>
		            </template>
		    </el-table-column>   
		</el-table>
				
		
		</div>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				activeName: 'second',
				value: '',
				options: [{
				          value: '',
				          label: '全部'
				        }, {
				          value: '1',
				          label: '一级创客'
				        }, {
				          value: '2',
				          label: '二级创客'
				        }],
						table_loading: false,
						formInline: {
						    userName:'',
							userId: '',
							userNum: '',
						    userStat:'',
						    sort:'CRE_TIME',
						    desc:'DESC',
						    pageNum:1,
						    pageSize: 10
						},
						CountUserList: [{
							countFirst: '',
							countSecond: '',
							countMarkerFirst: '',
							countMarkerSecond: ''
						}],
						type: '',
						pageInfo: {
						    pageNum: 1,
						    pageSize: 10,
						    count: 1,
						    dtos:[]
						},
						formActStatList: [
							{
								value: 'B',
								label: '审核中'
							},
							{
								value: 'L',
								label: '平台拒绝'
							},
							{
								value: 'P',
								label: '平台通过'
							},
							{
								value: 'F',
								label: '快捷通拒绝'
							},
							{
								value: 'S',
								label: '通过'
							}
						],
						moneyInfo: [
							{
								userName: '',
								sumIncomeToday: '',
								sumIncome: ''
							}
						],
						CreatorInfor: [],
						storeId: '',
			}
		},
		created() {

		},
		activated() {
			this.storeId = this.$route.query.storeId
		    this.fetchData();
			this.getCreatorInfor()
			this.getCountUserNext()
		},
		methods: {
			changeType() {
				console.log('change创客筛选条件')
			},
			handleClick(tab, event) {
				console.log(tab, event);
			},
			navToEarningsList() {
				var vm = this
				vm.$router.push('/user/creator_IncomeList/'+vm.$route.query.id)
			},
			navToCashHistory() {
				var vm = this
				vm.$router.push('/user/creator_cashHistoryList/'+vm.$route.query.id)
			},
			fetchData() {
				let rid =this.$route.query.id
				let id = this.$route.query.storeId
				let data = {}
				if(id != '') {
					 data = {
						sotreId: id,
						userId: rid
					}
				} else{
					data = {
						userId: rid
					}
				}
			    this.table_loading = true;
			    this.dataApi.ajax('marKerHome',data, res => {
			        this.table_loading = false;
			        if (res.responseType === 'S') {
			            this.pageInfo = res
						this.moneyInfo[0].userName = res.userName
						this.moneyInfo[0].sumIncomeToday = res.sumIncomeToday
						this.moneyInfo[0].offSet = res.offSet
			        }
			    });
			
			},
			/**
			 * 方法说明
			 * author: liuchen
			 * description: 获取创客邀请统计数据
			 * @param 
			 * @return 
			 * @createTime: 2020/7/22
			 */
			getCountUserNext() {
				let rid =this.$route.query.id
			    this.table_loading = true;
			    this.dataApi.ajax('countUserNext',{userId: rid}, res => {
			        this.table_loading = false;
			        if (res.responseType === 'S') {
						this.CountUserList[0].countFirst = res.countFirst
						this.CountUserList[0].countMarkerSecond = res.countMarkerSecond
						this.CountUserList[0].countMarkerFirst = res.countMarkerFirst
						this.CountUserList[0].countSecond = res.countSecond
			        }
			    });
			},
			// 创客认证信息
			getCreatorInfor() {
				let rid =this.$route.query.id
				let data = {}
				if(this.storeId !=''){
					data = {
						storeId: this.storeId,
						userId: rid
					}
				} else{
					data = {
						userId: rid
					}
				}
				
			    this.table_loading = true;
			    this.dataApi.ajax('markerWithdrawInfo',data, res => {
			        this.table_loading = false;
			        if (res.responseType === 'S') {
						if (res.name) {
							data.name = res.name
							data.phoneNum = res.phoneNum
							data.address = res.address
							data.openingStatus = res.openingStatus
							data.failReason = res.failReason
							this.CreatorInfor = []
							this.CreatorInfor.push(data)
						} else{
							this.CreatorInfor = []
						}
						console.log(this.CreatorInfor, '创客认证信息')
			        }
			    });
			},
			handleCurrentChange(val) {
			   this.fetchData(val)            
			},
			/**
			 * 方法说明
			 * author: liuchen
			 * description: 前往创客详情页
			 * @param 
			 * @return 
			 * @createTime: 2020/7/22
			 */
			navToInviteDetail() {
				var vm = this
				vm.$router.push('/user/creator_inviteList/'+vm.$route.query.id)
			},
			navToVerifyDetail() {
				var vm = this
				vm.$router.push('/user/creator_verifyDetail/'+vm.$route.query.id)
			}
		}
	}
</script>


<style>
</style>
